<template>
  <div>
    <div class="flex">
      <compare-last-year-item class="flex-1" title="预测经营活动权责流入" :normType="1" :currentMoney="model.forecastIncomeTotal" :executeMoney="model.lastForecastIncomeTotal" :errorPercentage="model.incomeDeviationRate"></compare-last-year-item>
      <compare-last-year-item class="flex-1 margin-left-right-20" title="预测经营活动权责支出" :normType="2" :currentMoney="model.forecastExpendTotal" :executeMoney="model.lastForecastExpendTotal" :errorPercentage="model.expendDeviationRate"></compare-last-year-item>
      <compare-last-year-item class="flex-1" title="预测净经营收入" :normType="1" :currentMoney="model.netPlanIncomeTotal" :executeMoney="model.lastNetPlanIncomeTotal" :errorPercentage="model.netIncomeDeviationRate"></compare-last-year-item>
    </div>
  </div>
</template>
<script>
  import compareLastYearItem from './compareLastYearItem.vue';
  import { apiFinancialPerformance } from '../../../api/businessManage';
  export default {
    data() {
      return {
        model:{}
      };
    },

    methods: {
      async getInfo() {
        let res = await apiFinancialPerformance({
          projectKeys: this.$route.query.projectKey ? [this.$route.query.projectKey] : null,
          year: this.$route.query.year,
        });
        this.model = res
      },
    },

    mounted(){
      this.getInfo()
    },

    components: {
      compareLastYearItem,
    },
  };
</script>

<style lang="scss" scoped>
  .shdow:hover {
    box-shadow: 0px 6px 15px 0px rgba(0, 0, 0, 0.15);
  }
</style>
